import Link from 'next/link'
import Image from 'next/image'
import Footer from '../../components/footer'
import Header from '../../components/header'


export default function ContractMe() {
    return (
    <div className='flex min-h-screen flex-col items-center justify-center py-2'>
        <Header>Contract Me</Header>
        <main className='flex w-full flex-1 flex-col items-center justify-center px-20 text-center'>
            <div className="w-96 border-double rounded-xl border-8 p-6 text-left inline-block" >
                <h2 className='text-4xl font-bold'>Contact Me</h2>
                <div>
                    <div  >
                        <Image src="/github.svg" alt="github Logo" width={18} height={18} />
                        <span className='align-top inline-flex text-base'>Mahx2019</span>
                    </div>
                    <div  >
                        <Image src="/wechat.svg" alt="wechat Logo" width={18} height={18} />
                        <span className='align-top inline-flex text-base'>Tspoty</span>
                    </div>
                    <div  >
                        <Image src="/QQ.svg" alt="QQ Logo" width={18} height={18} />
                        <span className='align-top inline-flex text-base'>149165725</span>
                    </div>
                    <div  >
                        <Image src="/envelope-fill.svg" alt="envelop Logo" width={18} height={18} />
                        <span className='align-top inline-flex text-base'>Mahx2019@qq.com</span>
                    </div>
                </div>
            </div>
        </main>

        <div>
            <Link href="/">
                <a className='hover:bg-pink-400 '>Click to back home</a>
            </Link>
        </div>
        <Footer></Footer>
    </div>
    );
}
